<template>
    <div>
        <el-card class="xj-table-list">
            <avue-crud ref="crudxjAdminLog"
                       :data="data"
                       :option="option"
                       v-model:page="page"
                       v-model:search="search"
                       :table-loading="loading"
                       :cell-style="cellStyle"
                       @on-load="onLoad"
                       @refresh-change="onLoad"
                       @search-change="searchChange"
                       @row-click="handleRowClick">
                <template #menu="{scope,row,size,index}">
                    <el-button type="primary" :size="size" text @click="rowData=row ;updDialogVisible = true">查看</el-button>
                </template>

                <template #createTime-search="{disabled,size}">
                    <div class="block">
                        <el-date-picker
                            v-model="search.createTime"
                            type="datetimerange"
                            value-format="YYYY-MM-DD HH:mm:ss"
                            :shortcuts="defaultdata.timeOptions.shortcuts"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                        >
                        </el-date-picker>
                    </div>
                </template>
            </avue-crud>

            <el-dialog draggable title="查看" v-if="updDialogVisible" v-model="updDialogVisible" :width="dialogWidth" top="6vh" @close="closeDialog">
                <Upd @closeDialog="closeDialog" :uri="uri" :rowData="rowData"></Upd>
                <span slot="footer" class="dialog-footer"></span>
            </el-dialog>
        </el-card>
    </div>
</template>


<script>
import {defineAsyncComponent} from 'vue';

export default {
    components: {
        Upd: defineAsyncComponent(() => import('./logUpd.vue'))
    },
    data() {
        return {
            uri: {
                infoList: "/api/admin/sys/log/findPage",
            },
            loading: true,
            dialogWidth: "80%",
            addDialogVisible: false,
            updDialogVisible: false,
            page: this.website.pageParams,
            search: {},
            data: [],
            rowData: {},
            option: {},
            stateDict: [
                {
                    label: "成功",
                    value: 1
                },
                {
                    label: "失败",
                    value: 0
                }
            ],
            methodDict: [
                {
                    label: "GET",
                    value: "GET"
                },
                {
                    label: "POST",
                    value: "POST"
                },
                {
                    label: "PUT",
                    value: "PUT"
                },
                {
                    label: "DELETE",
                    value: "DELETE"
                }
            ],
            newCreateTime: '',
        }
    },
    mounted() {
        this.option = JSON.parse(JSON.stringify(this.website.optionConfig));
        //this.option.menu = false
        this.option.index = false;
        //this.option.viewBtn =true
        this.option.column = [
            {
                label: '请求人',
                prop: 'fullName',
                search: true,
                overHidden: true,
                searchSpan: 5,
            },
            {
                label: '请求人Id ',
                prop: 'userId',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '请求端',
                prop: 'type',
                search: true,
                overHidden: true,
                type: 'select',
                searchSpan: 5,
                dicData: this.dict.get(this.website.Dict.Base.AuthorityType),
            },

            {
                label: '请求类',
                prop: 'classDesc',
                search: true,
                searchSpan: 5,
                overHidden: true,
            },
            {
                label: '请求方法',
                prop: 'methodDesc',
                search: true,
                searchSpan: 5,
                overHidden: true,
            },
            {
                label: '请求url',
                prop: 'url',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '请求uri',
                prop: 'uri',
                search: true,
                searchSpan: 5,
                overHidden: true,
            },
            {
                label: '请求方式',
                prop: 'methods',
                type: 'select',
                multiple: true,
                search: true,
                searchSpan: 5,
                overHidden: true,
                dicData: this.methodDict,
                formatter: (row) => {
                    return row.method
                }
            },
            {
                label: '请求包',
                prop: 'packageName',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '请求类',
                prop: 'className',
                hide: true,
                search: false,
                overHidden: true,
            },

            {
                label: '请求时间',
                prop: 'createTime',
                overHidden: true,
                searchSpan: 7,
                search: true,
            } ,{
                label: '请求头',
                prop: 'requestHeader',
                overHidden: true,
            },
            {
                label: '请求数据',
                prop: 'requestData',
                search: false,
                overHidden: true,
            },
            {
                label: '响应数据',
                prop: 'responseData',
                search: false,
                overHidden: true,
            },
            {
                label: '响应总耗时',
                prop: 'executeTime',
                search: false,
                overHidden: true,
            },
            {
                label: '结果',
                prop: 'state',
                type: 'select',
                search: true,
                searchSpan: 4,
                overHidden: true,
                html: true,
                dicData: this.stateDict,
                formatter: (val) => {
                    if (val.state == 0) {
                        return '<span style="color: red">失败</span>'
                    } else if (val.state == 1) {
                        return '<span style="color: #2bc03f">成功</span>'
                    }
                },
            },
            {
                label: '业务总耗时',
                prop: 'businessTime',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '请求来源',
                prop: 'referer',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '用户真实Ip',
                prop: 'ip',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '用户主机名',
                prop: 'host',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '服务器地址',
                prop: 'serverName',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '服务器端口',
                prop: 'port',
                hide: true,
                search: false,
                overHidden: true,
            },
            {
                label: '数据Id',
                prop: 'dataId',
                hide: true,
                search: true,
                searchSpan: 5,
                overHidden: true,
            },

        ]
    },
    created() {
    },
    activated: function () {
        this.crud.doLayout(this, this.$refs.crudxjAdminLog)
    },
    methods: {
        onLoad() {
            this.crud.list(this, true);
            this.crud.doLayout(this, this.$refs.crudxjAdminLog)
        },
        searchChange(params, done) {
            console.debug(params)
            this.page.currentPage = 1;
            this.onLoad();
            done();
        },
        closeDialog(isRefresh) {
            this.addDialogVisible = false;
            this.updDialogVisible = false;
            this.rowData = {};
            if (isRefresh != null && isRefresh) {
                this.onLoad();
            }
        },
        rowDel(row, index) {
            this.crud.delRow(this, this.uri.info, row.id, index);
        },
        // 启用/禁用
        updDisable(row) {
            this.crud.put(this.uri.info + "/" + row.id, {disable: row.disable});
        },
        handleRowClick(row) {
            this.rowData = JSON.parse(JSON.stringify(row));
        },
        cellStyle({row, column}) {
            if (column.property == "disable") {
                // fontWeight: 'bold',fontSize: '20'
                return row.disable == 0 ? {color: 'green'} : {color: 'red'}
            }
        }
    }
}
</script>
